<!--
 * @Author: 灰灰
 * @Date: 2022-01-04 09:52:40
 * @LastEditors: Please set LastEditors
 * @LastEditTime: 2022-01-07 19:32:20
 * @Description: 饼图
-->
<template>
  <el-row :gutter="10">
    <el-divider>饼图</el-divider>
    <echart-view :needImg="needImg"
                 :option="chartOption"></echart-view>
  </el-row>
</template>

<script>
import chartMixin from '@/mixins/echartMixins/baseChartOption'
export default {
  name: 'echart',
  mixins: [chartMixin],
  props: {
    needImg: {
      type: Boolean,
      default: false
    }
  },
  data () {
    return {
    }
  },
  mounted () {
    setTimeout(() => {
      this.loadData()
    }, 1000);
  },
  methods: {
    loadData () {
      this.configLegend({
        orient: 'vertical',
        left: 'left'
      })

      const seriesPie = this.generatePieData({
        name: 'pie',
        data: [
          { value: 1048, name: 'Search Engine' },
          { value: 735, name: 'Direct' },
          { value: 580, name: 'Email' },
          { value: 484, name: 'Union Ads' },
          { value: 300, name: 'Video Ads' }
        ]
      })
      const series = [seriesPie];
      this.configSeries(series);
    }
  }
}
</script>

<style>
</style>